import { nextTick, ref } from 'vue';

export default function () {
  const userInfo = ref(null);
  const userId = ref(null);
  const timerCloseUserInfo = ref<number|undefined>(0);
  const targetElement = ref(null);
  const disableSelect = ref(false);

  function showPersonnelInfo(args) {
    userInfo.value = null;
    userId.value = null;
    if (timerCloseUserInfo.value) {
      clearTimeout(timerCloseUserInfo.value);
      timerCloseUserInfo.value = 0;
    }
    nextTick(() => {
      const { target, info, disableUserSelect } = args;
      targetElement.value = target;
      userInfo.value = info ? { ...info } : null;
      userId.value = target.dataset.userId;
      disableSelect.value = disableUserSelect;
    });
  }

  function hidePersonnelInfo() {
    timerCloseUserInfo.value = setTimeout(() => {
      userInfo.value = null;
      userId.value = null;
    }, 500) as unknown as number;
  }

  function onVisibleChange(close) {
    if (close) {
      userInfo.value = null;
      userId.value = null;
    } else {
      clearTimeout(timerCloseUserInfo.value);
      timerCloseUserInfo.value = 0;
    }
  }

  return {
    userInfo,
    userId,
    targetElement,
    disableSelect,
    showPersonnelInfo,
    hidePersonnelInfo,
    onVisibleChange,
  };
}
